<template>
	<view class="content">
		<view class="group-list" v-for="(item,index) in groupList" :key="index">
			<view class="title ">
				<view class="time">{{item.shop.name}}</view>
				<button class="action-btn recom" v-show="item.pintuanState==1">拼团成功</button>
				<!-- ==3 =》一键拼团失败，自动继续 -->
				<button class="action-btn recom" v-show="item.pintuanState==3">已失败</button>
				<button class="action-btn recom" v-show="item.pintuanState==2">已失败</button>
			</view>
			<view class="list-info" @click="toGroupdetail(item)">
				<view class="info-l">
					<image class="bgImage" :src="item.img" mode=""></image>
				</view>
				<view class="info-r">
					<view class="goods-name">{{item.name}}</view>
					<view class="num">{{item.shopPrice}} x 1</view>
				</view>
			</view>
			<view class="sf_price">实付款￥{{item.payMoney}}</view>
			<view class="group-status">
				<view v-show="item.pintuanState==2">拼团失败，获得{{item.rewardMoney}}鼓励金</view>
				<button class="action-btn default_btnColor" v-show="item.pintuanState==0">参与中</button>
				<button class="action-btn recom" v-show="item.pintuanState==2">已退款</button>
				<button class="action-btn recom" v-show="item.pintuanSuccessChoose==3">已选择寄售</button>
				<button class="action-btn recom" v-show="item.pintuanSuccessChoose==2">已选择商品</button>
				<button v-if="item.pintuanSuccessChoose == 1" style="width: 105px;" class="action-btn recom" @click="showmodal_(item,index)">{{pickertext}}</button>
			</view>
		</view>
		<uniPopup ref="ppp" type="center" class="grouplist_">
			<view class="pt-popup-wrap">
				<view class="title">温馨提示</view>
				<view class="uni-list">
					<view class="subtitle">请选择商品状态</view>
					<radio-group @change="radioChange">
						<view class="typeBox">
							<view class="font14">
								<radio :value="2+''" style="transform:scale(0.7)" color="#ee5b25" :checked="pt_type == 2" />商品
							</view>
							<view class="font14">
								<radio :value="3+''" style="transform:scale(0.7)" color="#ee5b25" :checked="pt_type == 3" />寄售
							</view>
						</view>
					</radio-group>
				</view>
				<view class="pt_confirm" @click="pt_confirm">确认</view>
			</view>
		</uniPopup>
	</view>
</template>

<script>
	function uniq(arr) {
		let res = [];
		for (let i = 0; i < arr.length; i++) {
			if (arr.indexOf(arr[i]) === i) {
				res.push(arr[i])
			}
		}
		return res;
	}

	import uniPopup from '@/components/uni-popup/uni-popup.vue'
	export default {
		components: {
			uniPopup
		},
		data() {
			return {
				pt_type: 0,
				pickertext: '请选择商品状态',
				pickertext_status: false,
				pickerindex: 0,
				array: [{
						value: '商品',
						type: 2,
						checked: false,
					},

					{
						value: '寄售',
						type: 3,
						checked: true,
					},
				],
				groupList: [],
				defaultlist: [],
				newlist: [],
				temporary_index: [],
				temporary_arr: [],
				pintuanOrderId:''
			}
		},
		onLoad() {
			this.getptgrouplist()
		},
		onShow() {

		},
		methods: {
			pt_confirm(){
				console.log(this.pt_type)
				let that = this;
				let data = {
					pintuanOrderId:that.pintuanOrderId,
					pintuanSuccessChoose:that.pt_type
				}
				that.$Request.request('/api/pintuan/pintuanSuccessChoose','POST',data).then(res=>{
					if(res.status == 1){
						this.$refs.ppp.close()
						this.getptgrouplist()
					}
				})
			},
			radioChange(e) {
				this.pt_type = e.detail.value;
			},
			checkboxChange(e, index) {
				console.log(e)
				console.log(this.pickerindex)
			},
			showmodal_(item, index) {
				let that = this;
				that.pintuanOrderId = item.pintuanOrderId
				this.$refs.ppp.open()
			},
			toGroupdetail(item) {
				let id = item.goodsId
				let pintuanStartId = item.pintuanStartId
				var isformorder = 0;
				uni.navigateTo({
					url: '../../pages/product/product?id=' + id + '&pintuanStartId=' + pintuanStartId + '&isformorder=' + item.pintuanState
				})
			},
			getptgrouplist() {
				var that = this;
				that.$Request.request('/api/pintuan/my', 'GET', {}).then(res => {
					if (res.status == 1) {
						that.groupList = res.data.list;
						if (res.data.notice != '') {
							uni.showModal({
								title: '温馨提醒',
								content: res.data.notice,
								showCancel: false,
								success: (res) => {
									if (res.errMsg == 'showModal:ok') {
										that.$Request.request('api/pintuan/pintuanNoticeDone', 'POST', {}).then(data => {
											console.log(data)
										})
									}
								}
							})
						}
					}
				}).catch(err => {
					console.log(err)
				})
			}
		}
	}
</script>
<style lang="scss" scoped>
	.pt-popup-wrap {
		.title {
			font-size: 14px;
		}
	}

	.pt_confirm {
		background-color: #ff6600;
		color: #fff;
		text-align: center;
		font-size: 14px;
		height: 30px;
		line-height: 30px;
	}

	.uni-popup .title {
		text-align: center;
		font-size: 14px;
		padding: 10px;
	}

	.uni-popup .subtitle {
		padding-bottom: 10px;
		font-size: 14px;
	}

	.uni-popup__wrapper.uni-custom.center .uni-popup__wrapper-box[data-v-7da806a4] {
		width: 80% !important;
	}

	.uni-popup .typeBox {
		display: flex;
		align-items: center;
		padding-bottom: 10px;
	}

	.content {
		background-color: #f2f2f2;
	}

	.default_btnColor {
		color: #fff !important;
		background-color: #027aff !important;
	}

	.sf_price {
		text-align: right;
		padding: 20upx;
		border-bottom: 1px solid #f2f2f2;
		margin-bottom: 20upx;
	}

	.recom {
		background: #e12038 !important;
		color: #fff !important;
	}

	.group-list {
		padding: 20upx 0upx;
		font-size: 24upx;
		background-color: #fff;
		margin-bottom: 20upx;

		.title {
			display: -webkit-box;
			display: -webkit-flex;
			display: flex;
			justify-content: space-between;
			margin-bottom: 20upx;
			padding: 0px 20upx;
		}

		.list-info {
			display: -webkit-box;
			display: -webkit-flex;
			display: flex;
			-webkit-box-align: center;
			-webkit-align-items: center;
			align-items: center;
			height: 100px;
			background-color: #fff;
			padding: 0 20upx;
			border-bottom: 1px solid #f2f2f2;
			box-sizing: border-box;
			.info-l {
				.bgImage {
					width: 140upx;
					height: 140upx;

					img {
						width: 100%;
						height: 100%;
					}
				}
			}

			.info-r {
				display: flex;
				flex-direction: column;
				/* justify-content: space-around; */
				margin-left: 10px;
			}
		}

		.action-btn {
			padding: 0px 20upx;
			width: 160upx;
			height: 50upx;
			margin: 0;
			margin-left: 24upx;
			padding: 0;
			text-align: center;
			line-height: 50upx;
			font-size: 24upx;
			color: #303133;
			background: #fff;
			// border: 1px solid rgba(0, 0, 0, .2) !important;
		}

		.group-status {
			display: flex;
			justify-content: flex-end;
			align-items: center;
			margin-right: 10px;




		}

	}
</style>
